import React from 'react'
import { NavBar, Button, Toast, Card, Image } from 'antd-mobile'
import { useLocation, useNavigate } from 'react-router-dom'
import style from '../detail/index.module.css'
import { HeartFill } from 'antd-mobile-icons'
function Index() {
    const navigate = useNavigate();
    const back = () => navigate(-1)
    const { state } = useLocation();

    return (
        <div className={style.zong}>
            <NavBar right={<span style={{ color: '#fff' }}>待使用</span>} onBack={back}><span style={{ color: '#fff' }}>订票信息</span></NavBar>


            <div style={{ marginTop: '10px' }}>
                <div className={style.cardbox}>
                    <div className={style.itimg}>
                        <Image style={{ width: '250px', height: '200px', borderRadius: '15px' }} src={state.image}>  </Image>
                        <div className={style.mestit}>
                            <h5>电音音乐节</h5>

                            <div className={style.girds}>
                                {/* <Image className={style.littleimg} src={state.image}></Image> */}
                                <dd style={{ marginRight: '120px' }}>{state.title}</dd>
                                <dd className={style.priceed}>{state.price}</dd>

                            </div>

                            <div className={style.two}>
                                <dd>持票人</dd>
                                <dd className={style.indextime}>日期</dd>
                            </div>

                            <div className={style.three}>
                                <dd>Koto</dd>
                                <dd className={style.indextime}>2024-11-18 上午8:00</dd>
                            </div>

                            <div className={style.four}>
                                <dd>位置</dd>
                                <dd className={style.indextime}>座位</dd>
                            </div>

                            <div className={style.five}>
                                <dd>北京体育馆</dd>
                                <dd className={style.indextime}>B23，B24</dd>
                            </div>

                            <Image className={style.tm} src='https://img1.baidu.com/it/u=266345745,2537254358&fm=253&fmt=auto&app=138&f=JPEG?w=632&h=421'></Image>
                        </div>


                        <span className={style.like}>音乐会</span>
                        <span className={style.like2}> <HeartFill fontSize={17} /> </span>


                    </div>

                </div>

                <Button className={style.btnsd} block color='primary' size='large'>
                    <span style={{ color: '#fff' }}>下载票证</span>
                </Button>
            </div>
        </div>


    )
}

export default Index
